<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="content-type" content="txt/html;charset=utf-8" />
		<title>javascript实现IE,firefox客户端图片预览</title>
		<script>
			//使用IE条件注释来判断是否IE6，通过判断userAgent不一定准确
			if(document.all) document.write('<!--[if lte IE 6]><script type="text/javascript">window.ie6= true<\/script><![endif]-->');
			// var ie6 = /msie 6/i.test(navigator.userAgent);//不推荐，有些系统的ie6 userAgent会是IE7或者IE8
			function change(picId, fileId) {
				var pic = document.getElementById(picId);
				var file = document.getElementById(fileId);
				if(window.FileReader) { //chrome,firefox7+,opera,IE10+
					oFReader = new FileReader();
					oFReader.readAsDataURL(file.files[0]);
					oFReader.onload = function(oFREvent) { pic.src = oFREvent.target.result;
						console.log(oFREvent.target.result);
						console.log('asdfdsa') };

				} else if(document.all) { //IE9-//IE使用滤镜，实际测试IE6设置src为物理路径发布网站通过http协议访问时还是没有办法加载图片
					file.select();
					file.blur(); //要添加这句，要不会报拒绝访问错误（IE9或者用ie9+默认ie8-都会报错，实际的IE8-不会报错）
					var reallocalpath = document.selection.createRange().text //IE下获取实际的本地文件路径
					//if (window.ie6) pic.src = reallocalpath; //IE6浏览器设置img的src为本地路径可以直接显示图片
					//else { //非IE6版本的IE由于安全问题直接设置img的src无法显示本地图片，但是可以通过滤镜来实现，IE10浏览器不支持滤镜，需要用FileReader来实现，所以注意判断FileReader先
					pic.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',src=\"" + reallocalpath + "\")";
					pic.src = ''; //设置img的src为base64编码的透明图片，要不会显示红xx
					// }
					console.log(reallocalpath)
				} else if(file.files) { //firefox6-
					if(file.files.item(0)) {
						url = file.files.item(0).getAsDataURL();
						pic.src = url;
					}
				}

			}
		</script>
	</head>

	<body>

		<form name="form1" enctype="multipart/form-data">
			<table>
				<tr>
					<td> 草图1：</td>
					<td>
						<input type="file" name="file1" id="file1" onchange="change('pic1','file1')">
					</td>
					<tr>
						<td>草图浏览1：</td>
						<td>
							<img src="images/px.gif" id="pic1">
						</td>
					</tr>
					<tr>
						<td> 草图2：</td>
						<td>
							<input type="file" name="file2" id="file2" onchange="change('pic2','file2')">
						</td>
						<tr>
							<td>草图浏览2：</td>
							<td>
								<img src="images/px.gif" id="pic2">
							</td>
						</tr>
			</table>
		</form>
	</body>

</html>